import 'package:flutter/material.dart';
import 'package:ceo_app/utills/ceoFont.dart';
import 'package:ceo_app/api/index.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  State<Home> createState() => _HomePageState();
}

class _HomePageState extends State<Home> {
  static int _currentIndex = 0;
  List list = [];
  int activeCateId = 0;
  List categoryList = [];

  // 获取帖子列表
  void getList({int? id}) async {
    try {
      final res = await Api.getPostingList({});
      debugPrint('resL==>${res.toString()}');
      setState(() {
        list = res['list'];
      });
    } catch (e) {}
  }

  // 获取分类列表
  void getCateList() async {
    try {
      final res = await Api.getCateList();
      debugPrint('res==>${res.toString()}');
      setState(() {
        categoryList = [
          {'id': 0, 'name': '全部'},
          ...res
        ];
      });
    } catch (e) {}
  }

  void handleChangeCate(id) {
    debugPrint('id$id');
    setState(() {
      activeCateId = id;
    });
  }

  @override
  void initState() {
    super.initState();
    getCateList();
    getList();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(backgroundColor: Colors.white, toolbarHeight: 0),
      body: SizedBox(
        height: double.infinity,
        child: Stack(
          children: [
            SingleChildScrollView(
                padding: const EdgeInsets.all(14),
                child: Column(
                  children: [
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.end,
                      children: const [
                        Padding(
                            padding: EdgeInsets.only(right: 14),
                            child: Text(
                              '推荐',
                              style: TextStyle(
                                  color: Colors.black,
                                  fontSize: 26,
                                  fontWeight: FontWeight.w600),
                            )),
                        Padding(
                            padding: EdgeInsets.only(right: 14),
                            child: Text(
                              '最新',
                              style: TextStyle(
                                color: Color(0xff333333),
                                fontSize: 16,
                              ),
                            )),
                        Padding(
                            padding: EdgeInsets.only(right: 14),
                            child: Text(
                              '关注',
                              style: TextStyle(
                                color: Color(0xff333333),
                                fontSize: 16,
                              ),
                            ))
                      ],
                    ),
                    SizedBox(
                      width: double.infinity,
                      height: 10.w,
                    ),
                    ConstrainedBox(
                      constraints: const BoxConstraints.expand(
                          width: double.infinity, height: 150),
                      child: Image.asset(
                        'assets/images/banner.png',
                        fit: BoxFit.cover,
                      ),
                    ),
                    SizedBox(
                      width: double.infinity,
                      height: 20.w,
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Container(
                          alignment: Alignment.center,
                          width: 80.w,
                          height: 96.w,
                          decoration: BoxDecoration(
                            border: Border.all(color: const Color(0xffDFDFDF)),
                            borderRadius:
                                const BorderRadius.all(Radius.circular(7)),
                          ),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.asset(
                                'assets/images/sign.png',
                                width: 28.w,
                                height: 28.w,
                              ),
                              SizedBox(
                                height: 5.w,
                              ),
                              Text(
                                '签到',
                                style: TextStyle(
                                    color: const Color(0xff222222),
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.w500),
                              ),
                              Text(
                                '点击签到',
                                style: TextStyle(
                                  color: const Color(0xff999999),
                                  fontSize: 12.sp,
                                ),
                              )
                            ],
                          ),
                        ),
                        Container(
                          alignment: Alignment.center,
                          width: 80.w,
                          height: 96.w,
                          decoration: BoxDecoration(
                            border: Border.all(color: const Color(0xffDFDFDF)),
                            borderRadius:
                                const BorderRadius.all(Radius.circular(7)),
                          ),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.asset(
                                'assets/images/rank.png',
                                width: 28.w,
                                height: 28.w,
                              ),
                              SizedBox(
                                height: 5.w,
                              ),
                              Text(
                                '排行榜',
                                style: TextStyle(
                                    color: const Color(0xff222222),
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.w500),
                              ),
                              Text(
                                '点击签到',
                                style: TextStyle(
                                  color: const Color(0xff999999),
                                  fontSize: 12.sp,
                                ),
                              )
                            ],
                          ),
                        ),
                        Container(
                          alignment: Alignment.center,
                          width: 80.w,
                          height: 96.w,
                          decoration: BoxDecoration(
                            border: Border.all(color: const Color(0xffDFDFDF)),
                            borderRadius:
                                const BorderRadius.all(Radius.circular(7)),
                          ),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.asset(
                                'assets/images/walf.png',
                                width: 28.w,
                                height: 28.w,
                              ),
                              SizedBox(
                                height: 5.w,
                              ),
                              Text(
                                '福利',
                                style: TextStyle(
                                    color: const Color(0xff222222),
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.w500),
                              ),
                              Text(
                                '即将开放',
                                style: TextStyle(
                                  color: const Color(0xff999999),
                                  fontSize: 12.sp,
                                ),
                              )
                            ],
                          ),
                        ),
                        Container(
                          alignment: Alignment.center,
                          width: 80.w,
                          height: 96.w,
                          decoration: BoxDecoration(
                            border: Border.all(color: const Color(0xffDFDFDF)),
                            borderRadius:
                                const BorderRadius.all(Radius.circular(7)),
                          ),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.asset(
                                'assets/images/wish.png',
                                width: 28.w,
                                height: 28.w,
                              ),
                              SizedBox(
                                height: 5.w,
                              ),
                              Text(
                                '许愿池',
                                style: TextStyle(
                                    color: const Color(0xff222222),
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.w500),
                              ),
                              Text(
                                '343个愿望',
                                style: TextStyle(
                                  color: const Color(0xff999999),
                                  fontSize: 12.sp,
                                ),
                              )
                            ],
                          ),
                        ),
                      ],
                    ),
                    SizedBox(
                      width: double.infinity,
                      height: 10.w,
                    ),
                    Container(
                      padding: EdgeInsets.fromLTRB(0, 15.w, 0, 15.w),
                      width: double.infinity,
                      height: 65.w,
                      decoration: const BoxDecoration(
                          border: Border(
                              bottom: BorderSide(color: Color(0xffE7E7e7)))),
                      child: ListView.builder(
                          itemCount: categoryList.length,
                          scrollDirection: Axis.horizontal,
                          itemBuilder: (
                            BuildContext context,
                            int index,
                          ) {
                            return activeCateId == categoryList[index]['id']
                                ? Container(
                                    margin: EdgeInsets.only(right: 25.w),
                                    decoration: BoxDecoration(
                                        border: Border(
                                      bottom: BorderSide(
                                        width: 3.w, //宽度
                                        color: Color(0xffFF5D34), //边框颜色
                                      ),
                                    )),
                                    child: Text(categoryList[index]['name'],
                                        style: TextStyle(
                                            color: const Color(0xff333333),
                                            fontWeight: FontWeight.w600,
                                            fontSize: 18.sp)),
                                  )
                                : GestureDetector(
                                    onTap: () {
                                      handleChangeCate(
                                          categoryList[index]['id']);
                                    },
                                    child: Container(
                                      margin: EdgeInsets.only(right: 25.w),
                                      child: Text(categoryList[index]['name'],
                                          style: TextStyle(
                                              color: const Color(0xff333333),
                                              fontWeight: FontWeight.w500,
                                              fontSize: 18.sp)),
                                    ),
                                  );
                          }),
                    ),
                    ...list.map((item) {
                      return Container(
                        padding: EdgeInsets.fromLTRB(6.w, 10.w, 6.w, 10.w),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Row(
                                  children: [
                                    ClipOval(
                                      child: Image.network(
                                        item['userInfo']['userInfo']['avatar'],
                                        width: 40.w,
                                        height: 40.w,
                                      ),
                                    ),
                                    Padding(
                                        padding: EdgeInsets.only(left: 7.w),
                                        child: Column(
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              item['userInfo']['userInfo']
                                                  ['real_name'],
                                              style: TextStyle(
                                                  fontSize: 14.sp,
                                                  color:
                                                      const Color(0xff333333)),
                                            ),
                                            Row(
                                              children: [
                                                Icon(
                                                    item['userInfo']['userInfo']
                                                                ['gender'] ==
                                                            'man'
                                                        ? CeoFont.men
                                                        : CeoFont.women,
                                                    size: 12.sp),
                                                Text(
                                                    item['address'] != ''
                                                        ? item['address']
                                                        : '位置待定位',
                                                    style: TextStyle(
                                                        color:
                                                            Color(0xFF999999),
                                                        fontSize: 12.sp))
                                              ],
                                            )
                                          ],
                                        ))
                                  ],
                                ),
                                Icon(
                                  CeoFont.more,
                                  size: 28.sp,
                                )
                              ],
                            ),
                            Padding(
                                padding: EdgeInsets.fromLTRB(0, 10.w, 0, 10.w),
                                child: Text(
                                  item['content'],
                                  style: TextStyle(
                                      fontSize: 14.sp,
                                      fontWeight: FontWeight.w600,
                                      color: const Color(0xff222222)),
                                )),
                            Image.network(item['images'][0])
                          ],
                        ),
                      );
                    })
                  ],
                )),
            Positioned(
              bottom: 20,
              right: 14,
              child: GestureDetector(
                  onTap: () {
                    debugPrint('你好');
                    Navigator.pushNamed(context, '/publish');
                  },
                  child: Container(
                    alignment: Alignment.center,
                    width: 100,
                    height: 40,
                    decoration: const BoxDecoration(
                        color: Color(0xff222222),
                        borderRadius: BorderRadius.all(Radius.circular(21))),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Image.asset(
                          'assets/images/add.png',
                          height: 12.w,
                          width: 12.w,
                        ),
                        const Text(
                          '发布内容',
                          style: TextStyle(
                              fontSize: 14,
                              color: Colors.white,
                              fontWeight: FontWeight.w500),
                        )
                      ],
                    ),
                  )),
            )
          ],
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _currentIndex,
        unselectedItemColor: Colors.black,
        selectedItemColor: Colors.black,
        onTap: (int index) {
          setState(() {
            _currentIndex = index;
          });
        },
        items: const [
          BottomNavigationBarItem(
            icon: Icon(Icons.image),
            activeIcon: Icon(Icons.image),
            label: '首页',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.image),
            label: '福利',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.calendar_month),
            label: '日历',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.man),
            label: '我的',
          ),
        ],
      ),
    );
  }
}
